﻿@section Scripts {
    <script type="text/javascript">
        $(document).ready(function () {
            //Build de dialog pour l'ajout d'opérations
            $("#dialog-newoperation").dialog({
                autoOpen: false,
                resizable: false,
                height: 410,
                width: 350,
                show: { effect: 'drop', direction: "up" },
                modal: true,
                draggable: false
            });

            //Build le dialog pour delete une operation
            $("#delete-operation-dialog").dialog({
                //Elements graphiques
                autoOpen: false,
                resizable: false,
                height: 200,
                width: 350,
                show: { effect: 'drop', direction: "up" },
                modal: true,
                draggable: false,
                //Define buttons of the dialog
                buttons:[
                {
                    text:"Delete",
                    click: function() 
                    { 
                        delete_operation($(this).attr('data-id')); //Call the function delete_operation
                        $( this ).dialog( "close" ); //Close the dialog
                    }
                },
                {
                    text:"Cancel",
                    click: function() 
                    { 
                        $( this ).dialog( "close" ); //Close the dialog
                    } 
                } 
                ]
            });
            initcontent();
        });


        function initcontent(pageindex)
        {
            if(!pageindex)
                pageindex = 0;

            $('#all-operations-div').load('Operation/AllOperations/' + pageindex, function(){

                // manage delete button behavior
                $('.deleteoperationbutton').click(function () {
                    $("#delete-operation-dialog").attr('data-id', $(this).attr('data-id'));
                    $("#delete-operation-dialog").text('Are you sure?');
                    $("#delete-operation-dialog").dialog('open');
                });

                // manage grid pagging behavior
                $('.PreviousPage').click(function(){
                    console.log(pageindex);
                    initcontent(pageindex - 1);
                });

                // manage grid pagging behavior
                $('.NextPage').click(function(){
                console.log(pageindex);
                    initcontent(pageindex + 1);
                });

            });
        }


        function openNewOperation() {
            $("#dialog-newoperation").dialog("open");
        }

        function delete_operation(id) {
            $.ajax({
                type: "POST",
                url: "Operation/DeleteOperation.cshtml/" + id,
            })
              .done(function (msg) {
                  alert("Operation deleted");
                  initcontent();
            });
        }

    </script>
}
@{
    Layout = "~/_SiteLayout.cshtml";
    Page.Title = "My Account";
}
<hgroup class="title">
    <h1>@Page.Title.</h1>
    <h2>My account</h2>
</hgroup>
@if (WebSecurity.IsAuthenticated)
{
    <div id="dialog-newoperation">
        @RenderPage("~/Operation/CreateOperation.cshtml", null)
    </div>
    
    <header>
        Your accounts table ! :)
    </header>
    
    <button type="button" onclick="openNewOperation();">New operation</button>
        
    <div id="delete-operation-dialog"></div>

    <div id="all-operations-div"></div>

}
